<svg title="alchi.five-value-scales.1-2"
    version="1.1" viewBox="0 200 800 400" xmlns="http://www.w3.org/2000/svg"
  >
  <style>
      svg { --fg: black; --bg: white; } /* light mode */

      .fig1 .stroke {
        stroke-width: 2;
        stroke: black; /* fallback when css variables are not supported */
        stroke: var(--fg);
      }

      .nofill {
        fill: none;
      }

      .fillbg {
        fill: white;
        fill: var(--bg);
      }

      .fillfg {
        fill: black;
        fill: var(--fg);
      }</style>
  <g class="fig1" transform="translate(0,500)">
    <g dominant-baseline="middle" fill="none" font-family="sans" font-size="40px" stroke="#000" text-anchor="middle">
      <text x="100" y="400" fill="#000000" font-family="sans-serif" font-size="40px" stroke="none" style="line-height:1.25" xml:space="preserve"><tspan x="100" y="400"/></text>
      <g transform="translate(0,-600)">
        <text class="fillfg" x="100" y="400" fill="#000000" stroke="none">13</text>
        <text class="fillfg" x="698.56" y="400" fill="#000000" stroke="none">24</text>
        <g transform="translate(0,200)" fill="none" stroke="#000" stroke-width="2">
          <rect x="150" y="175" width="100" height="50"/>
          <rect x="250" y="175" width="100" height="50"/>
          <rect x="350" y="175" width="100" height="50"/>
          <rect x="450" y="175" width="100" height="50"/>
          <rect x="550" y="175" width="100" height="50"/>
        </g>
      </g>
      <text class="fillfg" x="100" y="-3.7193297e-07" fill="#000000" stroke="none">14</text>
      <text class="fillfg" x="698.56" y="-3.7193297e-07" fill="#000000" stroke="none">23</text>
      <g transform="translate(0,-200)" fill="none" stroke="#000" stroke-width="2">
        <rect x="150" y="175" width="100" height="50"/>
        <rect x="250" y="175" width="100" height="50"/>
        <rect x="350" y="175" width="100" height="50"/>
        <rect x="450" y="175" width="100" height="50"/>
        <rect x="550" y="175" width="100" height="50"/>
      </g>
      <text x="300" y="100" fill="#000000" font-family="sans-serif" font-size="40px" stroke="none" style="line-height:1.25" xml:space="preserve"><tspan x="300" y="100"/></text>
      <text x="518.52222" y="-100" fill="#000000" font-family="sans-serif" font-size="40px" stroke="none" style="line-height:1.25" xml:space="preserve"><tspan x="518.52222" y="-100"/></text>
      <g transform="translate(-200,-400)">
        <text class="fillfg" x="500" y="300" fill="#000000" font-size="34.667px" stroke="none">1</text>
        <circle class="stroke nofill" cx="500" cy="300" r="49.891" fill="none" stroke="#000" stroke-width="2.2174"/>
      </g>
      <g transform="matrix(-1,0,0,1,700,-400)">
        <g transform="translate(200)" fill="#000" stroke="none">
          <circle cx="200" cy="200" r="6"/>
          <circle cx="200" cy="400" r="6"/>
        </g>
      </g>
      <path d="m300-200v50.109" fill="none" stroke="#000" stroke-width="2"/>
      <path d="m300-50.109v50.109" fill="none" stroke="#000" stroke-width="2"/>
      <g transform="translate(200,-400)">
        <text class="fillfg" x="300" y="300" fill="#000000" font-size="34.667px" stroke="none">2</text>
        <circle class="stroke nofill" cx="300" cy="300" r="49.891" fill="none" stroke="#000" stroke-width="2.2174"/>
      </g>
      <g transform="translate(200)">
        <g transform="matrix(-1,0,0,1,700,-400)">
          <g transform="translate(200)" fill="#000" stroke="none">
            <circle cx="200" cy="200" r="6"/>
            <circle cx="200" cy="400" r="6"/>
          </g>
        </g>
        <path d="m300-200v50.109" fill="none" stroke="#000" stroke-width="2"/>
        <path d="m300-50.109v50.109" fill="none" stroke="#000" stroke-width="2"/>
      </g>
    </g>
  </g>
</svg>
